<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link th:replace="fragment/header::css"/>
    <script th:replace="fragment/header::js"></script>
    <script th:replace="fragment/script::contextPath"></script>
</head>
<body>
<div th:replace="fragment/nav::nav"></div>
<div class="container">
    <!--<div class="col-sm-4">
        <ul class="list-group">
            <li class="list-group-item">来自管理员的通知</li>
            <li class="list-group-item">来自系统的通知</li>
            <li class="list-group-item">A third item</li>
            <li class="list-group-item">A fourth item</li>
            <li class="list-group-item">And a fifth one</li>
        </ul>
    </div>-->
    <!--<div class="col-sm-8">

    </div>-->
    <div class="card">
        <div class="card-body">
            <h5 class="card-title">系统消息</h5>
<!--            <h6 class="card-subtitle mb-2 text-muted">Card subtitle</h6>-->
<!--            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>-->
            <div class="card-text accordion" id="accordionExample">
                <div class="card" th:each="notice,noticeStatus:${list}">
                    <div class="card-header" th:id="${'heading'+noticeStatus.index}">
                        <h2 class="mb-0">
                            <button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" th:data-target="${'#collapse'+noticeStatus.index}" aria-expanded="true" th:aria-controls="${'collapse'+noticeStatus.index}" th:text="${notice.infoTitle}"></button>
                        </h2>
                    </div>

                    <div th:id="${'collapse'+noticeStatus.index}" class="collapse" th:aria-labelledby="${'heading'+noticeStatus.index}" data-parent="#accordionExample">
                        <div class="card-body"  th:utext="${notice.infoText}"></div>
                    </div>
                </div>
                <div class="card">
                    <!--<div class="card-header" id="headingTwo">
                        <h2 class="mb-0">
                            <button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                您由于发布引战言论，被封禁24小时
                            </button>
                        </h2>
                    </div>
                    <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
                        <div class="card-body">
                            您在视频 <a href="#" style="color: #007bff"><i class="bi bi-caret-right-fill"></i>动漫混剪</a> 发布的评论 “你们*****” 由于被管理员判断为引战，已被删除，并封禁您24小时，24小时内不可以发送评论，解封时间为2022-3-31。<a href="#" style="color: #007bff">《评论审核条例》</a>
                        </div>
                    </div>-->
                </div>
                <!--<div class="card">
                    <div class="card-header" id="headingThree">
                        <h2 class="mb-0">
                            <button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                                Collapsible Group Item #3
                            </button>
                        </h2>
                    </div>
                    <div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample">
                        <div class="card-body">
                            And lastly, the placeholder content for the third and final accordion panel. This panel is hidden by default.
                        </div>
                    </div>
                </div>-->
            </div>
<!--            <a href="#" class="card-link">Card link</a>-->
<!--            <a href="#" class="card-link">Another link</a>-->
        </div>
    </div>


</div>
</body>
</html>